<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>使用load()方法异步请求数据</title>
		<script src="./jquery.js" type="text/javascript"></script>
	</head>
	<body>
		<div id="divtest">
				<label for="btnShow">我最爱吃的水果</label>
				<input id="btnShow" type="button" value="加载" click="" />
			<ul></ul>
		</div>
		<script type="text/javascript">
			// 点击“加载”按钮时，向服务器请求加载一个指定页面的内容，
			// 加载成功后，将数据内容显示在<div>元素中，并将加载按钮变为不可用。
			$(function() {
				$("#btnShow").bind("click", function() {
					var $this = $(this);
					$("ul")
						// 显示加载动画 - 当load请求不到数据时
						.html("<img src='./loading.gif' alt=''/>")
						// 放置于服务器地址里
						.load("http://localhost:8080/jqurey-test-demo/fruit_part.html", function() {
							$this.attr("disabled", "true");
						});
				})
			});
		</script>
	</body>
</html>
